import type { App, Component, Directive } from 'vue';

import { createPinia } from 'pinia';
import router from '@/shared/router';
import 'virtual:svg-icons-register';

//use config
import { useConfig as visualUseConfig } from '@/visual/configs/use-config';

// antd组件
import Antd from 'ant-design-vue';

import { createProgressGuard } from '@/visual/guards/router-guard';
import { createNotFoundGuard, createAuthGuard } from '../guard/auth-guard';
import { createBrowserTitleGuard } from '../guard/title-guard';

// 使用的配置
const useConfig = {
  // antd 组件
  antdComponents: [Antd],
  //第三方组件
  thirdPartyComponents: [
    ...visualUseConfig.thirdPartyComponents,
    ...visualUseConfig.thirdPartyComponents,
  ],
  //自定义组件
  customComponents: [
    ...visualUseConfig.customComponents,
  ],
  //自定义指令
  customDirectives: [
    ...visualUseConfig.customDirectives,
  ],
  // 路由守卫
  routerGuards: () => {
    createProgressGuard(router);
    createBrowserTitleGuard(router);
    createNotFoundGuard(router);
    createAuthGuard(router);
  },
};

/**
 * 使用ant 组件
 * @param app
 */
function useAntdComponnet(app: App) {
  useConfig.antdComponents.forEach((componnet) => {
    app.use(componnet);
  });
}

/**
 * 使用第三方组件
 * @param app
 */
function useThirdPartyComponents(app: App) {
  useConfig.thirdPartyComponents.forEach((componnet) => {
    app.use(componnet);
  });
}

/**
 *  使用自定义组件
 * @param app  应用根
 */
function useCustomComponent(app: App) {
  useConfig.customComponents.forEach((customComponent: { name: string; component: Component }) => {
    app.component(customComponent.name, customComponent.component);
  });
}

/**
 *  使用自定义指令
 * @param app  应用根
 */
function useCustomDirectives(app: App) {
  useConfig.customDirectives.forEach((customDirective: { name: string; directive: Directive }) => {
    app.directive(customDirective.name, customDirective.directive);
  });
}

/**
 * 使用路由
 * @param app
 */
function useRouter(app: App) {
  app.use(router);
  useConfig.routerGuards();
}

/**
 * 使用store
 * @param app
 */
function useStore(app: App) {
  app.use(createPinia());
}


/**
 * 使用所有
 * @param app  应用根
 */
export function useAll(app: App) {
  useAntdComponnet(app);
  useThirdPartyComponents(app);
  useCustomComponent(app);
  useCustomDirectives(app);
  useRouter(app);
  useStore(app);
  return app;
}
